<template>
    
    <!-- 组件的模板 -->
    <div class="page add-member">
        <div class="weui-cells weui-cells_form">
            <div class="weui-cell phone-num">
                <div class="weui-cell__hd"><label class="weui-label">手机号</label></div>
                <div class="weui-cell__bd">
                    <input class="weui-input" type="text" placeholder="必填" pattern="[0-9]*" v-model="member_list.mobile" :value="member_list.mobile" @change="onChange(member_list.mobile)">
                </div>
                <span class="icon bg_sprite" @click="tellBook"></span>
            </div>
            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">姓名</label></div>
                <div class="weui-cell__bd">
                    <input class="weui-input" type="text" placeholder="必填" :readonly="readonly" v-model="member_list.user_name" :value="member_list.user_name" @change="onBlurMax(member_list.user_name)">
                </div>
            </div>
        </div>
        <div class="weui-cells">
            <a class="weui-cell weui-cell_access" href="javascript:;" @click="gotoRoleSelectList">
                <div class="weui-cell__bd">
                    <p><span class="title">角色</span><span>{{identity}}</span></p>
                </div>
                <div class="weui-cell__ft">
                </div>
            </a>
            <a class="weui-cell weui-cell_access" href="javascript:;" @click="selectGroup">
                <div class="weui-cell__bd">
                    <p><span class="title">部门</span><span>{{groupName}}</span></p>
                </div>
                <div class="weui-cell__ft">
                </div>
            </a> 
        </div>
        <p class="tip">添加成功后会给成员发送邀请信息</p>
    </div> 

         
</template>

<script>
    /**
     *  引入工具类库 或 Native API
     *  example : import widget from 'gapi/widget'
     */
    import clientUi from 'gapi/clientUi.js'
    import widget from 'gapi/widget.js'
    import teamApi from 'clientApi/teamApi.js'
    import * as util from 'js/util.js'
    import cache from 'gapi/cache.js'
    import commonPage from 'clientApi/commonPage.js'
    /**
     *  引入组件 以及 组件接口(Action)
     *  example : import Somecomponents from 'components/Somecomponents/Somecomponents'
     */

     let teamid = '';
     let user_id = '';
    /**
     *  组件实例对象
     */
    export default {
        components: {

        },
        data: function(){
            return{
                readonly:false,
                // roleArr:['普通成员','管理员'],
                identity:'普通成员',
                identity_id:'5',
                member_list:{
                    user_name:'',
                    mobile:''
                },
                user_add_team:false,
                admin_add_member:false,
                tellName:'',
                groupName:'',
                department_id:''
            }
        },
        vuex: {
            getters: {

            },
            actions: {

            }
        },
        methods: {
            /**
             * 初始化
             * @method init
             * @public
             * @return {Null} void
             */
            init (){
                this.$watch('member_list', (newe,old) => {
                    
                    if((/^\d{11}$/.test(newe.mobile))){ 
                        this.mobileIsRegister(newe.mobile)
                    }
                }, {deep: true})

                commonPage.getWebViewID((data)=>{
                    cache.setMemoryCache('memberInfoWebViewID',{'webViewID':data}) 
                })
                window.loadData = (data) => {
                    console.log(data)
                    if(data.key == 'teamSelectRole'){
                        this.identity = data.value.name
                        this.identity_id = data.value.id
                    }else if(data.key == 'selectGroup'){
                        this.department_id = data.value.id
                        this.groupName = data.value.name
                    }
                    
                }
            },
             /**
             * 身份选择
             */
            gotoRoleSelectList (){
                let encodeStr = encodeURIComponent(`teamId=${teamid}`)
                location.href = `dmsaas://SelectRole?urdData=${encodeStr}`
            },
            // 部门选择
            selectGroup (){
                let str = `teamid=${teamid}&backType=${1100}`
                let encodeStr = encodeURIComponent(str)
                location.href = `dmsaas://TeamDepartmentSelect?urdData=${encodeStr}`
            },
            /*完成*/
            addData (){
                if(this.member_list.mobile == '' || this.member_list.user_name == ''){
                    widget.toast('成员信息不能为空')
                    return
                }
                if(!(/^\d{11}$/.test(this.member_list.mobile))){ 
                    widget.toast('手机号格式错误')
                    return false; 
                }
                if(this.member_list.user_name.length > 10){
                    widget.toast('姓名不能超过10个字')
                    return false; 
                }
                if(this.identity == '请选择' || this.identity == ''){
                    widget.toast('请选择成员身份')
                    return false; 
                }
                commonPage.loadPageStatus('loading')
                // this.identity_id = this.identity == '管理员' ? 2 : 5
                let m_list = [{
                    user_name:this.member_list.user_name,
                    mobile:this.member_list.mobile,
                    identity:this.identity_id,
                    user_id:user_id
                }]
                let data ={
                    team_id:teamid,
                    project_id:0,
                    department_id:this.department_id,
                    member_list:m_list
                }
                console.log(data)
                util.ajax({
                    url:'/team/member/add',
                    type:'POST',
                    data:data,
                    timeout:10000,
                    success:(obj) => {
                        console.log(obj)
                        commonPage.loadPageStatus('loadSuccess')
                        if(obj&&obj.errno == 0){
                            let str = '添加成功'
                            widget.toast(str)
                            teamApi.updateMember()
                            commonPage.goBack(1)
                        }else if(obj.errno == 12006){
                            widget.toast(obj.errmsg)
                        }else if(obj.errno == 12014){
                            widget.toast(obj.errmsg)
                        }else{
                            widget.toast(obj.errmsg)
                        }
                    },
                    error: (xhr, status) => {
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('服务器异常')
                    },
                    noNetwork: () => {
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('网络连接失败，请检查网络')
                    }
                })
            },
            /*拉取通讯录*/
            tellBook (){
                teamApi.addFromContacts()
            },
            onBlurMax (name){
                if(name.length > 10){
                    widget.toast('姓名不能超过10个字')
                    return false; 
                }
            },
            onChange (mobile){
                if(mobile){
                    if(!(/^\d{11}$/.test(mobile))){ 
                        widget.toast('手机号格式错误')
                        return false; 
                    }
                }
            },
            /*判断手机号是否注册过----否，正常使用；是，返回姓名*/
            mobileIsRegister(mobile){
                util.ajax({
                    url:'/user/register/info',
                    type:'POST',
                    data:{
                        team_id: 10,
                        project_id: 0,
                        mobile: mobile
                    },
                    timeout:10000,
                    success:(obj) => {
                        // console.log(JSON.stringify(obj))
                        if(obj&&obj.errno == 0){
                            if(obj.data.real_name){
                                user_id = obj.data.id;
                                this.member_list.user_name = obj.data.real_name
                                this.readonly = true
                            }else{
                                user_id = ''
                                this.readonly = false
                            }
                        }else{
                            widget.toast(obj.errmsg)
                        }
                    },
                    error: (xhr, status) => {
                        widget.toast('服务器异常')
                    },
                    noNetwork: () => {
                        // 无网络的回调
                        widget.toast('网络连接失败，请检查网络')
                    }
                })
            }  
        },
        created(){
            teamid = util.getUrddataString('teamId') 
            this.groupName = util.getUrddataString('groupName') 
            this.department_id = util.getUrddataString('department_id') 
            window.passSelectedContactor = (data) => {
                console.log(data)
                this.tellName = data.name;
                let phone = '"'+data.phoneNumber+'"';
                let yztell = phone.replace(/[^0-9]+/g, '');
                if(!(/^\d{11}$/.test(yztell))){
                    widget.toast('手机号格式错误')
                    return false; 
                }else{
                    this.member_list.mobile = yztell
                }
                this.mobileIsRegister(this.member_list.mobile)
            }

            this.init();

             /*设置Native的头部*/
            commonPage.updateTitleBar({
                backAction: 'goBack',    // 点击返回按钮的动作（即回调函数名称）
                leftAction: 'goBack',    // 点击左按钮的动作（即回调函数名称）
                rightDisplay: true,            // 是否显示右按钮
                rightText: '完成',            // 右按钮文案
                rightAction: 'finished'    // 点击右按钮的文案（即回调函数名称）
            })

            window.finished = () => {
                this.addData()
            }
            window.goBack = () => {
                commonPage.goBack(1)
            }
        }
        
    }

    
</script>

<!-- CSS 样式 -->
<style src="../../node_modules/weui/dist/style/weui.css"></style>
<style src="../../static/css/common.css"></style>
<style src="../../static/css/team.css"></style>



